<template>
	<gracePage :customHeader="false">
		<!-- 页面主体 -->
		<view slot="gBody" class="grace-body">
			<xw-empty :isShow="emptyShow" text="暂无相关数据" textColor="#777777"></xw-empty>
			<view class="" v-if="emptyShow==false">
				<view class="grace-comments"  v-for="(item, index) in listData" :key="index" @tap="goDetail(item)">
					<view class="grace-comments-items">
						<image :src="item.avatar" class="grace-comments-face"></image>
						<view class="grace-comments-body">
							<view class="grace-comments-header">
								<text class="grace-comments-header-text">{{item.username}}</text>
								<text class="grace-comments-info-text">{{item.publishDate}}</text>
							</view>
							<text class="grace-comments-content">{{item.content}}</text>
						</view>
					</view>
					<view class="grace-img-card">
						<view v-for="(picItem, key) in item.pics" :key="key">
							<view class="grace-img-card-item">
								<view class="grace-img-card-img">
									<image :src="picItem" mode="aspectFill" class="grace-img-card-img"></image>
								</view>
							</view>
						</view>
					</view>
					<view class="grace-comments-info">
						<text class="grace-comments-replay-btn"></text>
						<text class="grace-comments-header-text grace-red grace-icons cuIcon-deletefill"  @tap.stop="del(item,index)"> 删除</text>
					</view>
				</view>
				<graceLoading :loadingType="loadingType"></graceLoading>
			</view>
		</view>
	</gracePage>
</template>
<script>
import gracePage from "../../plugin/graceUI/components/gracePage.vue";
import graceLoading from '../../plugin/graceUI/components/graceLoading.vue';
import xwEmpty from '@/components/xw-empty/xw-empty';
export default {
    data() {
    	return {
			emptyShow:false,//true显示，false隐藏
			listData: [],
			loadingType : 3,
			reload: false,//判断是否是下拉刷新
			pageNo:1,
			pageSize:10,
			isShow : false,//弹窗是否显示
    	}
    },
	onLoad() {
		this.getList();
		var this_=this;
		//添加监听刷新事件
		uni.$on('reloadMyNssq',function(data){
			// console.log('监听到事件来自 shuaxin ，携带参数 msg 为：' + data.msg);
			this_.reload = true;
			this_.pageNo=1;
			this_.getList();
		})
	},
	// 下拉刷新事件
	onPullDownRefresh: function (){
		this.reload = true;
		this.pageNo=1;
		this.getList();
	},
	onReachBottom : function(){
		//避免多次触发
		if (this.loadingType == 1 || this.loadingType == 2){return ;}
		this.reload = false;
		this.pageNo+=1;
		this.getList();
	},
	methods:{
		//查询数据
		getList: function (){
			//展示loading
			this.loadingType = 1;
			const user=uni.getStorageSync('user');
			uni.request({
				url: this.$config.apiUrl+"/dasPostController/myList/"+this.pageNo+"/"+this.pageSize,
				data: {
					appUserId:this.$store.getters.userid
				},
				success: data => {
					if (data.data.ok) {
						uni.stopPullDownRefresh();
						this.loadingType = 0;
						// let list = this.setTime(data.data);
						let list = data.data.data;
						if(list.length>0){
							// console.log(data.data)
							this.listData = this.reload ? list : this.listData.concat(list);
							for(var i=0;i<this.listData.length;i++){
								//图片
								let imgUrl=[];
								let imgList=[];
								imgUrl=(this.listData[i].picturesUrl==null || this.listData[i].picturesUrl=="")?'':this.listData[i].picturesUrl.split(",");
								for(var j=0;j<imgUrl.length;j++){
									if(imgUrl[j]!='' && imgUrl[j]!=null){
										var imgSerUrl=this.$config.imgUrl+'/'+imgUrl[j];
										imgList.push(imgSerUrl);
									}
								}
								this.listData[i].pics=imgList;
								//头像
								if(this.listData[i].avatar){
									this.listData[i].avatar=this.$config.imgUrl+'/'+this.listData[i].avatar;
								}else{
									this.listData[i].avatar='/static/avatar_boy.png';
								}
								
							}
						}
						//判断是否继续加载数据
						if(list.length<this.pageSize){
							this.loadingType = 2;//已加载全部
						}
						
						if(this.listData.length>0){
							this.emptyShow=false;
						}else{
							this.emptyShow=true;
						}
					}
				},
				fail: (data, code) => {
					console.log('fail' + JSON.stringify(data));
				}
			});
		},
		goEdit: function(e) {
			uni.navigateTo({
				url: './my_nssq?id=' + e.id
			});
		},
		goDetail: function(e) {
			this.$Router.push({name: 'my_nssq', params:e})
		},
		
		//删除
		del: function(e,key) {
			var me_=this;
			uni.showModal({
			    title: '提示',
			    content: '确定删除么?',
			    success: function (res) {
			        if (res.confirm) {
			           uni.showLoading({
							title: '执行删除中...'
			           });
					   uni.request({
							url: me_.$config.apiUrl+"/dasPostController/delete/"+e.id,
							success: data => {
								if (data.data.ok) {
									uni.hideLoading();
									uni.showToast({
									    title: data.data.message,
									    duration: 2000
									});
									me_.listData.splice(key,1);
								}
							},
							fail: (data, code) => {
								console.log('fail' + JSON.stringify(data));
							}
					   });
			        } else if (res.cancel) {
			            // console.log('用户点击取消');
			        }
			    }
			});
		},
	},
	components:{
		gracePage,graceLoading,xwEmpty
	}
}
</script>
<style>
	view{
		box-sizing:content-box;
	}
	.grace-img-card-img{width:340rpx;}
	.grace-img-card-item{width:226rpx; margin-bottom:11rpx;}
</style>